
<template>
    <div>
        <Rotation :rotationList="rotationList" v-if="isGetData"></Rotation>
        <Goods :goodsList="goodsList" v-if="isGetData"></Goods>
        <van-back-top right="20px" bottom="60px" />
    </div>
</template>
    
<script setup>
import { onMounted, ref, reactive } from 'vue';
import { getProductList, getCarouselChartData } from '@/api/home.js'
import Rotation from '@/components/Rotation.vue'
import Goods from '@/components/Goods.vue'
let rotationList = reactive([])
let goodsList = reactive([])
//控制轮播子组件显示，等父组件异步请求到数据后再显示
let isGetData=ref(false)
onMounted(async () => {
    try {
        rotationList = (await getCarouselChartData({ page: 1, limit: 10 })).data.list || [] 
        goodsList = (await getProductList({ page: 1, limit: 10 })).data.list || [] 
        isGetData.value=true     
    } catch (error) {
        console.log(error);
    }

})
</script>
    
<style  scoped></style>